.page
  .AccountManage
    .search-form.mb-20.pl-10.pr-10
      Row(type="flex" justify="start")
        Col.pr-20.mb-10(:md="{ span: 24 }" :lg="{ span: 12 }" :xl="{ span: 12 }" :xxl="{span: 6}")
          span.label-txt.w80 账号名称：
          Input(v-model="formData.name" placeholder="请输入账号名称" clearable)
        Col.pr-20.mb-10(:md="{ span: 24 }" :lg="{ span: 12 }" :xl="{ span: 12 }" :xxl="{span: 6}")
          span.label-txt.w80 登陆名称：
          Input(v-model="formData.userName" placeholder="请输入登陆名称" clearable)
        Col.pr-20.mb-10(:md="{ span: 24 }" :lg="{ span: 12 }" :xl="{ span: 12 }" :xxl="{span: 6}")
          span.label-txt.w80 手机号码：
          Input(v-model="formData.phone" placeholder="请输入手机号码" clearable)
        
        Col.mb-10(:md="{ span: 24 }" :lg="{ span: 12 }" :xl="{ span: 8 }" :xxl="{span: 4}")
          Button(v-if="hasFind" type="info" @click="searchFn") 查询
    
    .pl-20.pr-20.bg-white
      Table.hasTitle-table.beautiful-table(:columns="thead" :data="tableData" :stripe="true"
        @on-selection-change="handleOnSelectChange"
      )
        .clearfix.font-16(slot="header")
          .table-title-lefttxt.pull-left
            |合计
            span.text-info.pl-5.pr-5.font-weight {{tableComone.totalRows}}
            |条
          .pull-right.table-title-btns
            Button.mr-10(type="info" @click="handleShowBatchImportModal") 导入
            Button.mr-10(v-if="hasCreate" type="info" @click="handleShowCreateAccountModal(null)") 新增
            Button.mr-10(v-if="hasEnabledList" type="info" :disabled="!selectedId.length > 0" @click="enabledList(selectedId, true)") 启用
            Button.mr-10(v-if="hasDisEnabledList" type="warning" :disabled="!selectedId.length > 0" @click="enabledList(selectedId, false)") 禁用
            Button(type="warning" :disabled="!selectedId.length > 0" @click="handleDel(selectedId)") 删除

        template(slot-scope="{ row, index }" slot="action")
          Button.mr-10(v-if="hasEdit" type="text" size="small"  @click="handleShowCreateAccountModal(row.id)") 编辑
          Button.mr-10(type="text" size="small" v-if="!row.enabled && hasEnabledList" @click="enabledList(row.id, !row.enabled)") 启用
          Button.mr-10(type="text" size="small" v-if="row.enabled && hasDisEnabledList" @click="enabledList(row.id, !row.enabled)") 禁用
          Button(type="text" size="small" @click="isCreateVXCodeModal(row.id)" v-if="isShowCreateVXCodeBtn") 创建VXCore账户

        .clearfix.pl-20.pr-20(slot="footer")
          Page(
            :current="tableComone.pageIndex"
            :total="tableComone.totalRows"
            @on-change="onChangePage"
            @on-page-size-change="onpageSizeChange"
            show-sizer
            show-total
            placement="top"
            prev-text="上一页"
            next-text="下一页"
            :page-size-opts="[10, 20, 30, 50, 100]"
          )

  //- 新建弹窗
  CreateAccountModal(ref="CreateAccountModal" @handleSave="searchFn")
  //- 批量导入弹窗
  BatchImportModal(ref="BatchImportModal" @query="searchFn")